{% extends 'admin/public/base.html' %}


{% block con-header %}
<div class="container-fluid am-cf">
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-9">
            <div class="page-header-heading">
                <span class="am-icon-home page-header-heading-icon"></span>
                会员列表
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block con-footer %}
<div class="row-content am-cf">


	<div class="am-u-sm-12 am-u-md-6 am-u-lg-6">
	    <div class="am-form-group">
	        <div class="am-btn-toolbar">
<!-- 	            <div class="am-btn-group am-btn-group-xs">
	                <button type="button" class="am-btn am-btn-default am-btn-success"><span class="am-icon-plus"></span> 新增</button>
	                <button type="button" class="am-btn am-btn-default am-btn-secondary"><span class="am-icon-save"></span> 保存</button>
	                <button type="button" class="am-btn am-btn-default am-btn-warning"><span class="am-icon-archive"></span> 审核</button>
	                <button type="button" class="am-btn am-btn-default am-btn-danger"><span class="am-icon-trash-o"></span> 删除</button>
	            </div> -->
	        </div>
	    </div>
	</div>
	<!-- 搜索表单 -->
	<form  >
		<!-- 搜索条件 -->
	    <div class="am-u-sm-12 am-u-md-6 am-u-lg-3">
	        <div class="am-form-group tpl-table-list-select">
	            <select name="types" data-am-selected="{btnSize: 'sm'}">
	                  <option {% if request.GET.types == 'all' %} selected {% endif %} value="all" >所有类别</option>
	                  <option {% if request.GET.types == 'username' %} selected {% endif %} value="username" >用户名</option>
	                  <option {% if request.GET.types == 'email' %} selected {% endif %} value="email">邮箱</option>
	                  <option {% if request.GET.types == 'phone' %} selected {% endif %} value="phone">电话</option>
	                  <option {% if request.GET.types == 'age' %} selected {% endif %} value="age">年龄</option>
	                  <option {% if request.GET.types == 'sex' %} selected {% endif %} value="sex">性别</option>
	                  <option {% if request.GET.types == 'addtime' %} selected {% endif %} value="addtime">添加时间</option>
	                  <option {% if request.GET.types == 'status' %} selected {% endif %} value="status">状态</option>
	            </select>
	        </div>
	    </div>
	    <!-- 搜索框 -->
	    <div class="am-u-sm-12 am-u-md-12 am-u-lg-3">
	        <div class="am-input-group am-input-group-sm tpl-form-border-form cl-p">
	            <input name="keywords" type="text" class="am-form-field " value="{{ request.GET.keywords }}">
	            <span class="am-input-group-btn">
					<button class="am-btn  am-btn-default am-btn-success tpl-table-list-field am-icon-search" >
					</button>
				</span>
	        </div>
	    </div>
	</form>

	<!-- 图文列表 -->
	<div class="am-u-sm-12">
	    <table width="100%" class="am-table am-table-compact am-table-striped tpl-table-black ">
	        <thead>
	            <tr>
	                <th>头像</th>
	                <th>用户名</th>
	                <th>邮箱</th>
	                <th>电话</th>
	                <th>年龄</th>
	                <th>性别</th>
	                <th>添加时间</th>
	                <th>状态</th>
	                <th>操作</th>
	            </tr>
	        </thead>
	        <tbody>
	        	{% for v in uinfo %}
	            <tr class="gradeX">
	                <td>
	                    <img src="{{ v.picurl }}" class="tpl-table-line-img" alt="" width=50>
	                </td>
	                <td class="am-text-middle"> {{ v.id }} {{ v.username }}</td>
	                <td class="am-text-middle">{{ v.email }}</td>
	                <td class="am-text-middle">{{ v.phone }}</td>
	                <td class="am-text-middle">{{ v.age }}</td>
	                <td class="am-text-middle">{{ v.sex }}</td>
	                <td class="am-text-middle">{{ v.addtime|date:'Y-m-d H:i:s' }}</td>

	                <td class="am-text-middle">
	                	<select uid="{{ v.id }}" class="user_status_save" style="color:black">
	                		{% if v.status == 0 %}
		                	<option value="0" selected>正常</option>
		                	<option value="1" >禁止</option>
		                	<option value="3" >管理员</option>
		                	{% elif v.status == 1 %}
		                	<option value="0" >正常</option>
		                	<option value="1" selected>禁止</option>
		                	<option value="3" >管理员</option>
		                	{% elif v.status == 3 %}
		                	<option value="0" >正常</option>
		                	<option value="1" >禁止</option>
		                	<option value="3" selected>管理员</option>
		                	{% endif %}
		                </select>
	            	</td>

	                <td class="am-text-middle">
	                    <div class="tpl-table-black-operation">
	                        <a href="{% url 'admin_user_edit' v.id %}">
	                            <i class="am-icon-pencil"></i> 编辑
	                        </a>
	                        <a href="{% url 'admin_user_del' v.id %}" class="tpl-table-black-operation-del">
	                            <i class="am-icon-trash"></i> 删除
	                        </a>
	                    </div>
	                </td>
	            </tr>
	            {% endfor %}


	            <!-- more data -->
	        </tbody>
	    </table>
	</div>

	<!-- 分页 -->
	<div class="am-u-lg-12 am-cf">
		<div class="am-fr">
		    <ul class="am-pagination tpl-pagination">

		        {% load pagetag %}
		        {%  showPage  uinfo.paginator.num_pages request %}
		    </ul>
		</div>
	</div>


</div>
<script type="text/javascript">
	$('.user_status_save').change(function(){
		// 获取当前的选择状态
		res = $(this).val()
		// 获取用户id
		uid = $(this).attr('uid') 
		// 发送ajax请求修改用户状态
		$.get('{% url "admin_user_status" %}',{uid:uid,status:res});
	});
</script>
{% endblock %}